import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/product_detail_controller.dart';
import '../../../translations/app_translations.dart';
import '../../../utils/themes/app_theme.dart';

class ProductDetailView extends GetView<ProductDetailController> {
  const ProductDetailView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final themeExt = AppTheme.extensionOf(context);
    
    return Scaffold(
      appBar: AppBar(
        title: Text(LocaleKeys.productDetail.tr),
        centerTitle: true,
      ),
      body: Obx(() {
        if (controller.isLoading.value) {
          return const Center(
            child: CircularProgressIndicator(),
          );
        }
        
        if (controller.product.value == null) {
          return Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Icon(
                  Icons.error_outline,
                  size: 80,
                  color: Colors.grey,
                ),
                const SizedBox(height: 16),
                Text(
                  LocaleKeys.productNotFound.tr,
                  style: theme.textTheme.titleMedium?.copyWith(
                    color: Colors.grey,
                  ),
                ),
                const SizedBox(height: 24),
                ElevatedButton(
                  onPressed: controller.refreshProductDetail,
                  child: Text(LocaleKeys.retry.tr),
                ),
              ],
            ),
          );
        }
        
        final product = controller.product.value!;
        
        return RefreshIndicator(
          onRefresh: controller.refreshProductDetail,
          child: SingleChildScrollView(
            physics: const AlwaysScrollableScrollPhysics(),
            padding: const EdgeInsets.all(16),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                // 基本信息卡片
                Card(
                  margin: const EdgeInsets.only(bottom: 16),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(12),
                  ),
                  elevation: 2,
                  child: Padding(
                    padding: const EdgeInsets.all(16),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              LocaleKeys.basicInfo.tr,
                              style: theme.textTheme.titleMedium?.copyWith(
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                            _buildStatusChip(product.status),
                          ],
                        ),
                        const Divider(height: 24),
                        _buildInfoItem(
                          context,
                          LocaleKeys.productName.tr,
                          product.productName,
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.productId.tr,
                          product.productId.toString(),
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.productKey.tr,
                          product.productKey,
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.nodeType.tr,
                          controller.getNodeTypeName(product.nodeType),
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.status.tr,
                          controller.getStatusName(product.status),
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.createTime.tr,
                          product.createTime,
                        ),
                      ],
                    ),
                  ),
                ),
                
                // 详细信息卡片
                Card(
                  margin: const EdgeInsets.only(bottom: 16),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(12),
                  ),
                  elevation: 2,
                  child: Padding(
                    padding: const EdgeInsets.all(16),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          LocaleKeys.productInfo.tr,
                          style: theme.textTheme.titleMedium?.copyWith(
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const Divider(height: 24),
                        _buildInfoItem(
                          context,
                          LocaleKeys.protocol.tr,
                          product.protocolType,
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.dataFormat.tr,
                          controller.getDataFormatName(product.dataFormat),
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.authType.tr,
                          controller.getAuthTypeName(product.authenticationType),
                        ),
                        _buildInfoItem(
                          context,
                          LocaleKeys.productDesc.tr,
                          product.description.isNotEmpty
                              ? product.description
                              : LocaleKeys.noContent.tr,
                        ),
                      ],
                    ),
                  ),
                ),
                
                // 安全信息卡片
                Card(
                  margin: const EdgeInsets.only(bottom: 16),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(12),
                  ),
                  elevation: 2,
                  child: Padding(
                    padding: const EdgeInsets.all(16),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Row(
                          children: [
                            Icon(
                              Icons.security,
                              color: theme.primaryColor,
                              size: 20,
                            ),
                            const SizedBox(width: 8),
                            Text(
                              LocaleKeys.securityInfo.tr,
                              style: theme.textTheme.titleMedium?.copyWith(
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                          ],
                        ),
                        const Divider(height: 24),
                        _buildSecretItem(
                          context,
                          LocaleKeys.productSecret.tr,
                          product.productSecret,
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          ),
        );
      }),
    );
  }
  
  Widget _buildInfoItem(BuildContext context, String label, String value) {
    final theme = Theme.of(context);
    final themeExt = AppTheme.extensionOf(context);
    
    return Padding(
      padding: const EdgeInsets.only(bottom: 12),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 100,
            child: Text(
              label,
              style: TextStyle(
                color: themeExt.textSecondary,
                fontSize: 14,
              ),
            ),
          ),
          Expanded(
            child: Text(
              value,
              style: TextStyle(
                fontSize: 14,
                fontWeight: FontWeight.w500,
              ),
            ),
          ),
        ],
      ),
    );
  }
  
  Widget _buildSecretItem(BuildContext context, String label, String value) {
    final theme = Theme.of(context);
    final themeExt = AppTheme.extensionOf(context);
    final valueNotifier = ValueNotifier<bool>(false);
    
    return Padding(
      padding: const EdgeInsets.only(bottom: 12),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 100,
            child: Text(
              label,
              style: TextStyle(
                color: themeExt.textSecondary,
                fontSize: 14,
              ),
            ),
          ),
          Expanded(
            child: ValueListenableBuilder<bool>(
              valueListenable: valueNotifier,
              builder: (context, isVisible, child) {
                return Row(
                  children: [
                    Expanded(
                      child: Text(
                        isVisible ? value : '••••••••••••••••',
                        style: TextStyle(
                          fontSize: 14,
                          fontWeight: FontWeight.w500,
                          fontFamily: isVisible ? null : 'monospace',
                        ),
                      ),
                    ),
                    IconButton(
                      icon: Icon(
                        isVisible ? Icons.visibility_off : Icons.visibility,
                        size: 18,
                      ),
                      onPressed: () {
                        valueNotifier.value = !isVisible;
                      },
                    ),
                  ],
                );
              },
            ),
          ),
        ],
      ),
    );
  }
  
  Widget _buildStatusChip(int? status) {
    String label;
    Color color;
    
    switch (status) {
      case 0: // 开发中
        label = '开发中';
        color = Colors.orange;
        break;
      case 1: // 已发布
        label = '已发布';
        color = Colors.green;
        break;
      default:
        label = '未知';
        color = Colors.grey;
    }
    
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
      decoration: BoxDecoration(
        color: color.withOpacity(0.1),
        borderRadius: BorderRadius.circular(12),
        border: Border.all(color: color.withOpacity(0.5)),
      ),
      child: Text(
        label,
        style: TextStyle(
          color: color,
          fontSize: 12,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  }
} 